<!DOCTYPE HTML>
<html style="background: #f3f3f3;">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>签约网</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../css/style.css" />
    <link rel="stylesheet" type="text/css" href="../css/lawyer.css" />
    <script type="text/javascript" src="../script/api.js"></script>
    <script type="text/javascript" src="../script/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="../script/mobile.js"></script>
    <script type="text/javascript" src="../script/lawyer.js"></script>
</head>
<body>
<div id="secHeader">
  <header class="header">
      <a href="javascript:void(0);" onclick="api.closeWin()" class="back_btn"><img src="../image/head-fanhui.png" alt=""></a>
      <h2>查询诉讼费</h2>
      <!--<a href="javascript:void (0);" class="search_btn set_btn">设置</a>-->
  </header>
</div>

<section class="calc_section">
    <div class="release_list">
        <ul>
            <li>
                <div class="release_item">
                    <p>选择地区</p>
                    <span class="kinds_name" id="re"></span>
                </div>
            </li>
            <li>
                <div class="release_item">
                    <p>案件类型</p>
                    <span class="kinds_name" id='aj'></span>
                </div>
            </li>
            <li>
                <div class="release_item">
                    <p>是否涉及财产</p>
                    <div class="checkbox_box">
                        <input type="checkbox">
                    </div>
                </div>
            </li>
            <li>
                <div class="release_item">
                    <p>其他费用</p>
                </div>
                <div class="other_cost">
                    <dl>
                        <dd><p>申请支付令</p><span>财产案件受理费的1/3</span></dd>
                        <dd><p>申请公示催告</p><span>每件100</span></dd>
                        <dd><p>申请确仲或撤仲</p><span>每件400</span></dd>
                    </dl>
                </div>
            </li>
            <li class="result">
                <div class="release_item">
                    <p>计算结果</p>
                </div>
                <div class="other_cost result_cost">
                    <dl>
                        <dd><p>受理费</p><span id='money'>50-100元</span></dd>
                        <dd><p>执行费</p><span>50-500元</span></dd>
                        <dd><p>保全费</p><span>30元</span></dd>
                    </dl>
                </div>
            </li>
        </ul>
    </div>
</section>


<section class="calc_btn">
    <a href="javascript:void (0);" onclick="countfee(2)">计算结果</a>
</section>

<section class="fixed_select" id="ajsec">
    <div class="select_content">
        <h6>请选择案件类型</h6>
        <ul id='cate'>

        </ul>
    </div>
</section>
<section class="fixed_select" id="resec">
    <div class="select_content">
        <h6>请选择地区</h6>
        <ul id='reg'>

        </ul>
    </div>
</section>
</body>

<script>
    var ajid=0;
    var addrid=0;
    var type=0;
    apiready = function () {
      $api.fixStatusBar( $api.dom('#secHeader') );
      api.setStatusBarStyle({
          style: 'light'
      });


        cate();
    };
    function countfee(type){
        if(ajid==0){
            alert('请选择案件类型！');return;
        }else if(addrid==0){
            alert('请选择地区！');return;
        }
        var p={ajid:ajid,addrid:addrid,type:type};
        api.ajax({
            url: webSiteUrl+'/app/public/countfee',
            method: 'post',
            data: {
                values: p
            }
        }, function(ret, err) {
            if(ret.code==200){
                $('#money').html(ret.data+'元')
                $(".result").show();
            }else{
                alert(ret.msg);
            }
        });

    };

    $("#re").click(function () {
        $("#resec").fadeToggle();
        $(".fixed_select .select_content").animate({
            'top': '0',
            'opacity': '1'
        },400);
        type=1
    });
    $("#aj").click(function () {
        $("#ajsec").fadeToggle();
        $(".fixed_select .select_content").animate({
            'top': '0',
            'opacity': '1'
        },400);
        type=2
    });
    $(document).on('click','.select_content ul li',function(){
        if(type==1){
            addrid=$(this).attr('data');
            $("#re").text($(this).html());
        }else{
            ajid=$(this).attr('data');
            $("#aj").text($(this).html());
        }

        //$(".kinds_name").text($(this).html());
        $(".fixed_select").fadeOut();
        $(".fixed_select .select_content").animate({
            'top': '-4rem',
            'opacity': '0'
        },400);
    })


    //是否涉及财产勾选
    $(".checkbox_box").click(function () {
        if($(this).hasClass('active')){
            $(this).removeClass('active');
        }else {
            $(this).addClass('active')
        }
    });
    //结果计算
   /* $(".calc_btn a").click(function () {
        $(".result").show();
    })*/
    function cate(){
        api.ajax({
            url: webSiteUrl+'/app/public/ajcate',
            method: 'post',
            data: {

            }
        }, function(ret, err) {
            api.hideProgress();

            if(ret.code==200){

                f = "";
                s = "";
                var tj=ret.data;

                html='';
                if(tj != null){
                    for(var i=0;i<tj.length;i++){
                           html+='<li data="'+tj[i].id+'">'+tj[i].name+'</li>';

                        /*var son=tj[i].son
                        if(son != null){

                            for(var j=0;j<son.length;j++){
                                html+='<option value="'+son[j].id+'">'+son[j].name+'</option>';
                            }

                        }*/

                    }
                }
                $('#cate').html(html)
            }
            ajcity()
        });

    };
     function ajcity(){
        api.ajax({
            url: webSiteUrl+'/app/public/region',
            method: 'post',
            data: {

            }
        }, function(ret, err) {

            if(ret.code==200){

                f = "";
                s = "";
                var tj=ret.data;
                 if(tj != null){
                    for(var i=0;i<tj.length;i++){

                            f+='<li style="cursor: pointer" data="'+tj[i].id+'">'+tj[i].name+'</li>';

                    }
                }
                $('#reg').html(f)

            }else{
                alert(ret.msg);
            }
        });

    }
</script>
</html>
